.dashboard_style {
  h1 {
    font-size: 24px;
    float: left;
  }
  p.bar_details {
    float: left;
    color: #959595;
    font-size: 16px;
    width: 574px;
    text-align: center;
    padding: 8px 0 0;
    font-family: 'Dosis Regular', sans-serif;
  }
  .dashboart_menu {
    text-align: center;
    width: 100%;
    padding: 0 0 40px 0;
    overflow: hidden;
    ul li {
      float: left;
      margin: 0 10px 0 0;
      &:last-child {
        margin: 0px;
      }
      a {
        display: block;
        min-width: 201px;
        height: 28px;
        border: 1px solid #d7d7d7;
        border-radius: 4px;
        text-align: center;
        font-family: 'Dosis Medium', sans-serif;
        font-style: normal;
        font-size: 20px;
        color: #464646;
        padding: 8px 0 0 0;
        &.small {
          min-width: 200px;
        }
        &.small_last {
          min-width: 200px;
        }
        &:hover {
          background: #00bde5;
          color: #ffffff;
          text-decoration: none;
          border-color: #00bde5;
        }
      }
    }
  }
  .graph_wrapper, .amount_wrapper, .activity_wrapper {
    float: left;
    width: 100%;
    padding: 0 0 30px 0;
  }
  .activity_wrapper {
    padding-top: 30px;
  }
  .dashboard_box {
    float: left;
    width: 92.9%;
    padding: 22px 29px 29px 28px;
    border: 1px solid #d7d7d7;
    border-radius: 4px;
    &.small {
      width: 85.5%;
      max-height: 305px;
      min-height: 264px;
      overflow: hidden;
      position: relative;
      &.right {
        width: 92.6%;
        padding-right: 0px;
      }
      p {
        float: left;
        width: 92.5%;
        line-height: 1.4;
        padding: 10px 29px 17px 0;
      }
    }
    .heading {
      float: left;
      width: 100%;
      .chzn-container, p, select{
        float: left;
      }
      .chzn-container{
        margin: 3px 0 0 6px;
      }
      select{
        width: 80px;
        float: left;
      }
      p.bar_details{
        width: 430px;
      }
    }
  }
  .graph_wrapper {
    .graph_content {
      float: left;
      width: 100%;
      margin-top: 25px;
      margin-bottom: -6px;
    }
  }
  .amount_wrapper {
    .amount_box {
      float: left;
      width: 172px;
      margin: 0 25px 0 0;
      &:last-child {
        margin: 0px;
        width: 174px;
      }
      h1 {
        float: left;
        width: 100%;
        &.black {
          float: left;
          font-size: 30px;
          color: #464646;
          padding: 7px 0 11px 0;
          .medium-unit{
            font-size: 65%;
            font-family: "Dosis Medium", sans-serif;
            display: inline-block;
          }
        }
      }
      p {
        float: left;
        width: 100%;
        line-height: 1.4;
        span {
          font-size: 10px;
        }
      }
      .days_summary {
        float: left;
        width: 100%;
        padding: 9px 0 0 0;
      }
      .amount_row {
        float: left;
        width: 100%;
        margin: 0 0 1px 0;
        .days {
          float: left;
          width: 105px;
          span {
            float: right;
          }
        }
        .value {
          float: left;
          width: 59px;
          padding: 0 0 0 4px;
          text-align: left;
          .ie7 &, .ie8 &, .ie9 &, .ie10 {
            width: 58px;
            background: #00a8d8;
          }
        }
      }
    }
  }
  .grid_table {
    &.current_invoices {
      &.top {
        padding-right: 29px;
        padding-top: 0px;
        width: 92.5%;
        table {
          table-layout: auto;
        }
      }
      &.btm {
        padding-top: 0px;
        width: 92.5%;
      }
      table {
        col.one {
          /*invoice*/
          width: 71px;
        }
        col.two {
          /*client pvt*/
          width: 131px;
        }
        col.three {
          /*date*/
          width: 83px;
        }
        col.four {
          /*amounts*/
          width: 70px;
        }
        th {
          font-weight: bold;
          color: #464646;
          border-right: none !important;
        }
        td {
          border-bottom: none !important;
        }
        tr {
          th, td {
            border-top: 1px solid #d7d7d7;
            background: #ffffff;
            padding-right: 0px;
            padding-left: 0px;
            text-align: center;
          }
        }
      }
    }
    &.activity{
      table{
        col.one {/*invoice*/
          width: 80px;
        }
        col.two {
          /*usd value*/
          width: 150px;
        }
        col.three {
          /*description*/
          width: 240px;
        }
        col.four { /*amounts*/
          width: 305px;
        }
        td {
          border-bottom: none !important;
          border-top: 1px solid #d7d7d7;
          span {
            font-size: 10px;
          }
        }
        tr {
          &:nth-child(odd), &:nth-child(odd) td {
            background: #f7f7f7;
          }
          &:hover {
            background: none !important;
          }
        }
      }
    }
  }
  .span6{
    width: 49.2857%;
    &.custome{
      margin-left: 1.4264%;
    }
  }
}

.graph_popup {
  .modal {
    width: 370px;
    margin: -165px 0 0 -62px;
    border: 1px solid #D7D7D7;
    border-radius: 4px;
    box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.08);
    padding: 0px;
    .modal-body {
      overflow-y: inherit;
      padding: 0px;
      margin: 0px;
    }
  }
  .dashboard_box {
    padding: 15px 0px 20px 19px;
    border: none;
    &.small {
      min-height: 172px;
    }

  }
  h1 {
    font-size: 18px;
    padding-bottom: 6px;
  }
  .grid_table.current_invoices.top {
    width: 94.6%;
  }
  .scrollContainer {
    width: 102.3%;
    height: 112px;
  }
  .grid_table.current_invoices.top,
  .grid_table.current_invoices.btm {
    table {
      th, td {
        font-size: 11px;
      }
      col.one {
        /*invoice*/
        width: 55px;
      }
      col.two {
        /*usd value*/
        width: 92px;
      }
      col.three {
        /*description*/
        width: 75px;
      }
      col.four {
        /*status*/
        width: 40px;
      }
      col.five {
        /*amounts*/
        width: 65px;
      }
      .mCSB_scrollTools .mCSB_draggerContainer {
        left: 1px;
      }
    }
  }
  .grid_table.paid_invoices.top,
  .grid_table.paid_invoices.btm {
    table {
      col.one {
        /*invoice*/
        width: 65px;
      }
      col.two {
        /*usd value*/
        width: 102px;
      }
      col.three {
        /*description*/
        width: 85px;
      }
      col.four {
        /*status*/
        width: 75px;
      }
      .mCSB_scrollTools .mCSB_draggerContainer {
        left: 1px;
      }
    }
  }
  .g_green {
    color: #8EC42A;
    &:hover {
      color: #8EC42A;
    }
  }
  .popup_close_container{
    float: right;
    position: absolute;
    right: 0px;
    width: 31px;
    height: 27px;
    margin: 4px 0 0 0;
    background: asset-url('btn_close_bg.png') no-repeat;
    z-index: 9999;
  }
  .popup_close{
    width: 7px;
    height: 7px;
    background: asset-url('btn_x.png') no-repeat;
    cursor: pointer;
    margin: 5px 0 0 15px;
    &:hover{
      background: asset-url('btn_x.png') no-repeat 0px -7px;
    }
  }
}

.dashboard_box{
  &.custom{
    width: 94.5%;
    padding-right: 15px;
    .amount_box{
      width: 175px;
      padding-right: 15px;
      margin-right: 0px;
      h1.black{
        font-size: 26px;
        .medium-unit{
          font-size: 55%;
        }
      }
      &.custom{
        width: 220px;
        padding-right: 0px;
        .value{
          width: 110px;
          .medium-unit{
            display: inline;
            font-size: 9px;
            padding-left: 2px;
            color: #464646;
          }
        }
      }
    }
  }
}

